<template>
	<view class="set">
		<view class="list">
			<view class="top">
				<view class="left">
					ID
				</view>
				<view class="right">
					{{userId}}
				</view>
			</view>
			<view class="top second">
				<view class="left">
					绑定手机号
				</view>
				<view class="right">
					{{phone}}
				</view>
			</view>
			<!-- <view class="top">
				<view class="left">
					修改登录密码
				</view>
				<view class="right">
					<image src="../../static/images/arrows-right.png" mode=""></image>
				</view>
			</view> -->
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userLogo: '../../static/images/user.png',
				userId:"",
				userName:"",
				phone:""
			}
		},
		onShow() {
			this.userId = uni.getStorageSync('userId')
			this.phone = uni.getStorageSync('phone')
		},
		methods: {
			logout(){
				uni.showModal({
					title:"确定退出登录？",
					showCancel:true,
					success:res=>{
						if(res.confirm){
							  uni.clearStorageSync();
							  uni.switchTab({
							  	url:'/pages/mine/mine'
							  })
						}
					}
				})
			},
			goUser(){
				uni.navigateTo({
					url:'../user/user'
				})
			}
		}
	}
</script>

<style lang="scss">
	.set{
		background-color: #f2f2f2;
		height: 100vh;
		box-sizing: border-box;
	.content{
		display: flex;
		align-items: center;
		background:rgba(255,255,255,1);
		height: 160upx;
		.user{
			width: 100upx;
			margin-left: 28upx;
			image{
				width: 100upx;
				height: 100upx;
				border-radius: 50%;
				background:rgba(246,78,106,1);
			}
		}
		.name{
			width:552upx ;
			margin-left: 20upx;
			font-weight:bold;
			color:rgba(51,51,51,1);
			.id{
				font-size:24upx;
				font-weight:500;
				color:rgba(77,77,77,1);
			}
		}
		.right{
			width: 20upx;
			image{
				width: 20upx;
				height: 20upx;
			}
		}
	}
	.list{
		margin-top: 10upx;
		.second{
			border-bottom:1upx solid #F0F0F0;
			border-top:1upx solid #F0F0F0;
		}
		.top{
			display: flex;
			justify-content: space-between;
			align-items: center;
			height: 100upx;
			background:rgba(255,255,255,1);
			padding: 0 30upx;
			.left{
				font-size:32upx;
				font-weight:500;
				color:rgba(51,51,51,1);
				// width: 690upx;
			}
			.right{
				// width: 20upx;
				font-size: 28upx;
				image{
					width: 20upx;
					height: 20upx;
				}
			}
		}
		
	}
	.quit{
		margin-top: 30upx;
		display: flex;
		justify-content: center;
		font-size:32upx;
		font-weight:500;
		color:rgba(51,51,51,1);
		line-height:100upx ;
		background:rgba(255,255,255,1);
	}
}
</style>
